|
纯CSS实现Table固定表头和首列
正在努力的二哈:
.tableBox_border {
width:100%;
height:100%;
overflow:auto;
border: 1px #EBEEF5 solid;
margin-top: 20rpx;
text-align: left;
margin-bottom:50rpx;
.headerBox{
display: flex;
justify-content: space-between;
align-items: center;
}
/* 首列固定 */
.uni-table > .uni-table-tr:first-nth(1) > .uni-table-th:first-nth(1);
.uni-table > .uni-table-tr:first-nth(2) > .uni-table-td:first-nth(1){
position: sticky;
left: 0;
z-index: 1;
}
/* 表头固定 */
.uni-table > .uni-table-tr:first-nth(1) > .uni-table-th{
position: sticky;
top: 0;
z-index: 2;
}
/* 表头首列强制最顶层 */
.uni-table > .uni-table-tr:first-nth(1) > .uni-table-th:first-nth(1){
z-index: 3;
}
}
|